<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<select name="pro" id="pro" onclick="bian();">
		<option value="0">请选择省市</option>
		<option value="1">北京</option>
		<option value="2">山东</option>
		<option value="3">河南</option>
	</select>
	<select name="city" id="city"></select>
</body>
<script type="text/javascript">
	function bian(){
		var map = ['',['海定','朝阳','顺义','昌平','大兴'],['济南','青岛','威海','临沂','潍坊'],['郑州','洛阳','开封','安阳','新乡']];
		var pro = document.getElementById('pro');
		// alert(pro);
		var city = document.getElementById('city');
		var citys = map[pro.value];
		// console.log(citys);
		var len = citys.length;
		var str = '';
		for(var i=0;i<len;i++){
			str = str + '<option>' + citys[i] +'</option>';
		}

		city.innerHTML = str;
	}
	
</script>
</html>